import React, { useState, useRef } from "react";
import {
  ScrollView,
  StyleSheet,
  Text,
  View,
  Button,
} from "react-native";
import { TestSuite, TestCase, Tester } from '@rnoh/testerino';
import CookieManager from "@react-native-cookies/cookies";
import { WebView } from "react-native-webview";
export interface Cookie {
  name: string;
  value: string;
  path?: string;
  domain?: string;
  version?: string;
  expires?: string;
  secure?: boolean;
  httpOnly?: boolean;
}
export interface Cookies {
  [key: string]: Cookie;
}
export function TextCookiesTest() {
  const httpUrl = "https://www.baidu.com";
  const [result, setResult] = useState("请点击按钮，进行操作");
  const webViewRef = useRef(null);

  const AddMenuClearAllTest = (props: {
    setState: React.Dispatch<React.SetStateAction<boolean>>;
  }) => {

    const addCustomMenuItem = async () => {
      let cookieResult = await CookieManager.clearAll(true);
      props.setState(true);
      let result = cookieResult
        ? "清除所有cookie成功"
        : "清除所有cookie失败";
      setResult(result + "");
    };

    return (
      <View style={styles.container}>
        <Button title="清除所有cookie" onPress={addCustomMenuItem} />
      </View>
    );
  };

  const AddMenuSetTest = (props: {
    setState: React.Dispatch<React.SetStateAction<boolean>>;
  }) => {

    const addCustomMenuItem = async () => {
      let curCookie: Cookie = { name: "myAddSessionCookie", value: "myNewCookie" };

      let sessionCookie1: Cookie = { 
        name: "myAddSessionCookie1", 
        value: "myNewSessionCookie1",
        expires:"2025-10-30T14:00:00.00-05:00"
      };

      let cookieResult1 = await CookieManager.set(httpUrl, curCookie, true);
      let cookieResult2 = await CookieManager.set(httpUrl, sessionCookie1, true);
      let result = cookieResult1&&cookieResult2
        ? "根据url设置cookie成功"
        : "根据url设置cookie失败";
      console.info(result);


      let cookiesBefore = await CookieManager.get(httpUrl, true);
    
      setResult(result);

      props.setState(true);

    };

    return (
      <View style={styles.container}>
        <Button title="根据url设置cookie" onPress={addCustomMenuItem} />
      </View>
    );
  };



  const AddMenuGetTest = (props: {
    setState: React.Dispatch<React.SetStateAction<boolean>>;
  }) => {

    const addCustomMenuItem = async () => {
      let cookieResult = await CookieManager.get(httpUrl, true);
      setResult(JSON.stringify(cookieResult));
      console.log(80, cookieResult)
      props.setState(true);

    };

    return (
      <View style={styles.container}>
        <Button title="根据url获取cookie" onPress={addCustomMenuItem} />
      </View>
    );
  };

  const AddMenuClearByNameTest = (props: {
    setState: React.Dispatch<React.SetStateAction<boolean>>;
  }) => {

    const addCustomMenuItem = async () => {
      let cookieResult = await CookieManager.clearByName(
        httpUrl,
        "myAddSessionCookie",
        true
      );
      let result = cookieResult
        ? "根据名称删除cookie成功"
        : "根据名称删除cookie失败";
      setResult(result);
      props.setState(true);
    };

    return (
      <View style={styles.container}>
        <Button title="根据名称删除cookie" onPress={addCustomMenuItem} />
      </View>
    );
  };

  const AddMenuRemoveTest = (props: {
    setState: React.Dispatch<React.SetStateAction<boolean>>;
  }) => {

    const addCustomMenuItem = async () => {
      // 在执行删除前先获取当前所有Cookie
      let cookiesBefore = await CookieManager.get(httpUrl, true);

      // 执行删除会话Cookie操作
      let cookieResult = await CookieManager.removeSessionCookies();
      
      // 删除后再次获取Cookie
      let cookiesAfter = await CookieManager.get(httpUrl, true);
      
      let resultMessage = cookieResult
        ? "清除会话cookie成功\n"
        : "清除会话cookie失败\n";
      
      resultMessage += `删除后Cookie: ${JSON.stringify(cookiesAfter)}`;
      console.info(`删除后Cookie: ${JSON.stringify(cookiesAfter)}\n`);
      setResult(resultMessage);
      props.setState(true);
    };

    return (
      <View style={styles.container}>
        <Button title="清除会话cookie" onPress={addCustomMenuItem} />
      </View>
    );
  };

  return (
    <Tester style={{ flex: 1 }}>
      <ScrollView style={{ flex: 1 }}>
        <TestSuite name="TextSize">
          <ScrollView style={styles.resultArea}>
            <Text style={{ color: "#fff" }}>{result}</Text>
          </ScrollView>
          <TestCase
            itShould="clearAll"
            initialState={false}
            arrange={({ setState }) => <AddMenuClearAllTest setState={setState} />}
            assert={({ state, expect }) => {
              expect(state).to.be.true;
            }}
          />
          <TestCase
            itShould="set session cookie"
            initialState={false}
            arrange={({ setState }) => <AddMenuSetTest setState={setState} />}
            assert={({ state, expect }) => {
              expect(state).to.be.true;
            }}
          />

          <TestCase
            itShould="get cookies"
            initialState={false}
            arrange={({ setState }) => <AddMenuGetTest setState={setState} />}
            assert={({ state, expect }) => {
              expect(state).to.be.true;
            }}
          />
          <TestCase
            itShould="clearByName"
            initialState={false}
            arrange={({ setState }) => <AddMenuClearByNameTest setState={setState} />}
            assert={({ state, expect }) => {
              expect(state).to.be.true;
            }}
          />

          <TestCase
            itShould="removeSessionCookies (should only remove session cookies)"
            initialState={false}
            arrange={({ setState }) => <AddMenuRemoveTest setState={setState} />}
            assert={({ state, expect }) => {
              expect(state).to.be.true;
            }}
          />
        </TestSuite>
      </ScrollView>
    </Tester>
  );
}

const styles = StyleSheet.create({
  container: {
    height: 50,
    justifyContent: 'center',
  },
  pageArea: {
    width: "100%",
    height: 150,
  },
  resultArea: {
    width: "100%",
    height: 200,
    borderWidth: 2,
    borderColor: "gray",
    borderRadius: 10,
    marginTop: 5,
  },
  button: {
    backgroundColor: "#FF0000",
    paddingHorizontal: 16,
    paddingVertical: 10,
    borderRadius: 24,
    alignItems: "center",
    justifyContent: "center",
    elevation: 4,
    width: "80%",
    marginTop: 5,
  },
});

export const displayName = 'react-native-cookies-cookies';
export const framework = 'React';
export const category = 'basic';
export const title = 'react-native-cookies-cookies';
export const documentationURL = 'https://gitee.com/react-native-oh-library/usage-docs/blob/master/zh-cn/react-native-cookies-cookies.md';
export const description = 'react-native-cookies-cookies';

export const examples = [
    {
        title: 'react-native-cookies-cookies',
        render: function (): any {
            return <TextCookiesTest />;
        },
    },
];